<script setup>
import { HomeFilled } from "@element-plus/icons-vue";
import { useRouter } from "vue-router";

const router = useRouter();

const props = defineProps({
  name: String,
  docType: String,
});

const exportWorld = () => {
  ElMessageBox.confirm("确定要导出该方案吗？", "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(() => {
      let url;
      switch (props.docType) {
        case "基本方案":
          url = `/back/renfang/doc/basicScheme/word?docType=basicSheme`;
          break;
        default:
          const obj = {
            跨区支援行动计划: "crosssupport",
            平战转换行动计划: "spaceToWar",
            人员防护行动计划: "protectioaction",
            重要目标防护行动计划: "targetProtection",
            情报信息保障计划: "intelligence",
            综合保障计划: "comprehensiveSupport",
            政治工作计划: "politicalwork",
          };
          url = `/back/renfang/doc/export/word?docType=${obj[props.docType]}`;
          break;
      }
      window.location.href = url;
    })
    .catch(() => {});
};

const goHome = () => {
  router.push("/pagehome");
};
</script>
<template>
  <div class="head flex-justify-between-center">
    <div class="flex-aligin-center">
      <img src="@/assets/logo.png" class="img" />
      <span class="title left-14">{{ name }}</span>
    </div>

    <div class="flex-aligin-center">
      <div class="flex-aligin-center pointer" @click="exportWorld">
        <img
          src=""
          class="export_img"
        />
        <span class="export_title left-5">导出 </span>
      </div>
      <div class="flex-aligin-center pointer left-15" @click="goHome">
        <el-icon :size="16" color="#fff"><HomeFilled /></el-icon>
        <span class="export_title left-5">首页 </span>
      </div>
    </div>
  </div>
</template>
<style scoped lang="scss">
.head {
  width: 100%;
  height: 57px;
  background: linear-gradient(180deg, #1a51c7 0%, #154abc 100%);
  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.27);
  padding: 0 24px;

  .img {
    width: 30px;
  }

  .title {
    font-size: 24px;
    color: #ffffff;
  }

  .export_img {
    width: 16px;
  }

  .export_title {
    font-size: 12px;
    color: #ffffff;
  }
}
</style>
